<template>
	<view class="psh">
		<u-navbar title="发布商品" :background="{ background: '#a0cfff' }" title-color="#FFFFFF"></u-navbar>
		<view class="pshC u-p-20">
			<scroll-view :scroll-y="true">
				<view class="pshSin u-p-20 u-m-b-25" v-for="(item, index) in shopList" :key="index">
					<view class="top">
						<view class="left">
							<u-icon name="home" :size="30" color="rgb(94,94,94)"></u-icon>
							<view class="store">{{item.userName}}</view>
							<u-icon name="arrow-right" color="rgb(203,203,203)" :size="26"></u-icon>
						</view>
						<view class="right" v-if="item.shopSold">已下架</view>
					</view>
					<view class="item u-m-t-15" @click="singShop(item.id)">
						<view class="left">
							<image :src="item.shopUrl" mode="aspectFill"></image>
						</view>
						<view class="content">
							<view class="title u-line-2">{{ item.title }}</view>
							<view class="title u-line-2 u-font-24" style="color: #909399;">{{ item.content }}</view>
							<view class="type">
								<text class="typeTitle">{{ item.lity.listType }}成新</text>
							</view>
							<view class="delivery-time u-m-t-30">时间： {{ item.updateTime }}</view>
						</view>
						<view class="right">
							<view class="price">
								￥{{ item.price }}
								<!-- <text class="decimal">.{{ priceDecimal(item.price) }}</text> -->
							</view>
							<view class="number">原：{{ item.shopNum }}</view>
							<view class="number">现：{{ item.shopBuy }}</view>
						</view>
					</view>
					<view class="bottom">
						<u-button type="warning" shape="circle" size="mini" plain @click="updateShop(item.id)">修改
						</u-button>
						<u-button class="u-m-l-30" type="error" shape="circle" size="mini" plain
							v-if="item.shopSold == false" @click="updateShopSold(item.id,true)">下架</u-button>
						<u-button class="u-m-l-30" type="primary" shape="circle" size="mini" plain v-else
							@click="updateShopSold(item.id,false)">上架</u-button>
						<view class="titleTy u-m-l-30" @click="deleteClick(item.id)">删除</view>
					</view>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	import helper from '../../common/helper.js'
	import time from '../../common/time.js'
	export default {
		data() {
			return {
				shopList: []
			}
		},
		created() {
			this.getShop()
		},
		methods: {
			singShop(index) {
				uni.navigateTo({
					url: '../../pages/shopes/shopXQ?id=' + index
				})
			},
			//获取商品
			getShop() {
				let that = this
				let user = uni.getStorageSync("user")
				let data = {
					userId: user.id
				}
				that.postRequest(helper.getAllShopT, data).then(res => {
					if (res.data.flag == "200") {
						let serve = res.data
						that.shopList = []
						serve.shops.forEach((item, index) => {
							if (item.shopUrl.indexOf("<<tupian>>") > 0) {
								item.shopUrl = item.shopUrl.split("<<tupian>>")[0]
								// console.log(index)
							}
							that.$set(item, 'userName', user.username)
							item.creatTime = that.formatDateTime(item.creatTime)
							item.updateTime = that.formatDateTime(item.updateTime)
							that.shopList.push(item)
						})
					}
				})
			},
			updateShopSold(index, show) {
				let that = this
				let data = {
					id: index,
					shopSold: show
				}
				var tile;
				if (show == true) {
					tile = "下架"
				}
				if (show == false) {
					tile = "上架"
				}
				that.postRequest(helper.updateShopSold, data).then(res => {
					if (res.data.flag == "200") {
						uni.showToast({
							title: tile + '成功',
							icon: 'none',
							duration: 2000
						})
						that.getShop()
					} else {
						uni.showToast({
							title: tile + '失败',
							icon: 'none',
							duration: 2000
						})
					}
				})
			},
			updateShop(index) {
				uni.navigateTo({
					url: '../../pages/publish/updateShop?id=' + index
				})
			},
			deleteClick(index) {
				let that = this
				uni.showModal({
					title: '提示',
					content: '是否删除该商品？',
					success: function(res) {
						if (res.confirm) {
							let data = {
								id: index,
							}
							that.postRequest(helper.deleteShop, data).then(res => {
								if (res.data.flag == "200") {
									uni.showToast({
										title: '删除成功',
										icon: 'none',
										duration: 2000
									})
									that.getShop()
								} else {
									uni.showToast({
										title: '删除失败',
										icon: 'none',
										duration: 2000
									})
								}
							})
						} else if (res.cancel) {
							uni.showToast({
								title: '删除失败',
								icon: 'none',
								duration: 2000
							})
						}
					}
				});
			}
		},
		computed: {
			// 价格小数
			priceDecimal() {
				return val => {
					if (val !== parseInt(val)) return val.slice(-2);
					else return '00';
				};
			},
			// 价格整数
			priceInt() {
				return val => {
					if (val !== parseInt(val)) return val.split('.')[0];
					else return val;
				};
			}
		}
	}
</script>

<style>
	page {
		background-color: rgb(240, 240, 240);
	}
</style>
<style lang="scss" scoped>
	.psh {
		.pshC {
			.pshSin {
				background-color: #FFFFFF;
				border-radius: 12rpx;
				// box-shadow:0px 0px 6px #00000030;
				box-shadow: 5rpx 5rpx -5rpx #FFFFFF;

				.top {
					display: flex;
					justify-content: space-between;

					.left {
						display: flex;
						align-items: center;

						.store {
							margin: 0 10rpx;
							font-size: 32rpx;
							font-weight: bold;
						}
					}

					.right {
						color: $u-type-warning-dark;
					}
				}

				.item {
					display: flex;
					justify-content: space-between;

					// margin: 20rpx 0 0;
					.left {
						margin-right: 20rpx;

						image {
							width: 200rpx;
							height: 200rpx;
							border-radius: 10rpx;
						}
					}

					.content {
						.title {
							font-size: 28rpx;
							line-height: 50rpx;
						}

						.type {
							margin: 10rpx 0;
							font-size: 24rpx;
							color: $u-tips-color;

							.typeTitle {
								color: #DD524D;
								border: 1rpx solid #DD524D;
								border-radius: 8rpx;
								padding: 5rpx;
							}
						}

						.delivery-time {
							color: #e5d001;
							font-size: 24rpx;
						}
					}

					.right {
						margin-left: 10rpx;
						padding-top: 20rpx;
						text-align: right;

						.decimal {
							font-size: 24rpx;
							margin-top: 4rpx;
						}

						.number {
							color: $u-tips-color;
							font-size: 24rpx;
						}
					}
				}

				.bottom {
					display: flex;
					margin-top: 40rpx;
					padding: 0 10rpx;
					justify-content: flex-end;
					align-items: center;

					.titleTy {
						font-size: 24rpx;
						color: $u-tips-color;
					}
				}

			}
		}
	}
</style>
